<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="myTheme.css">
</head>

<body>
  <code>webpack.config.js</code>

  <div class="markdown-code-block">
    <pre lang="shell" class="shell"><code class="hljs stata">npm i webpack webpack-<span class="hljs-keyword"><span class="hljs-keyword">cli</span></span> -<span class="hljs-keyword"><span class="hljs-keyword">g</span></span>
    </code></pre>
    <div class="markdown-code-block-copy-btn"></div>
  </div>

  <div class="markdown-code-block">
    <pre lang="js" class="js"><code class="hljs javascript"><span class="hljs-comment"><span class="hljs-comment">// module.rules</span></span>
    {
      test: <span class="hljs-regexp"><span class="hljs-regexp">/\.css/</span></span> <span class="hljs-comment"><span class="hljs-comment">// 匹配目标文件</span></span>
      use: <span class="hljs-string"><span class="hljs-string">'css-loader'</span></span> <span class="hljs-comment"><span class="hljs-comment">// 选择loader 需要单独安装</span></span>
    }
    </code></pre>
    <div class="markdown-code-block-copy-btn"></div>
  </div>

  <div class="markdown-code-block">
    <pre lang="js" class="js"><code class="hljs javascript"><span class="hljs-comment"><span class="hljs-comment">// plugins</span></span>
    plugins: [
      <span class="hljs-comment"><span class="hljs-comment">// type object</span></span>
      <span class="hljs-keyword"><span class="hljs-keyword">new</span></span> UglifyJsPlugin()
    ]
    </code></pre>
    <div class="markdown-code-block-copy-btn"></div>
  </div>

  <div class="markdown-code-block">
    <pre lang="js" class="js"><code class="hljs javascript"><span class="hljs-keyword"><span class="hljs-keyword">var</span></span> config = {
      entry: <span class="hljs-string"><span class="hljs-string">'./app.js'</span></span>,
      <span class="hljs-comment"><span class="hljs-comment">//...</span></span>
    };
    
    <span class="hljs-built_in"><span class="hljs-built_in">module</span></span>.exports = (env, argv) =&gt; {
      <span class="hljs-keyword"><span class="hljs-keyword">if</span></span> (argv.mode === <span class="hljs-string"><span class="hljs-string">'development'</span></span>) {
        config.devtool = <span class="hljs-string"><span class="hljs-string">'source-map'</span></span>;
      }
      <span class="hljs-keyword"><span class="hljs-keyword">if</span></span> (argv.mode === <span class="hljs-string"><span class="hljs-string">'production'</span></span>) {
        <span class="hljs-comment"><span class="hljs-comment">//...</span></span>
      }
      <span class="hljs-keyword"><span class="hljs-keyword">return</span></span> config;
    };
    </code></pre>
    <div class="markdown-code-block-copy-btn"></div>
  </div>

  <code>webpackChunkName</code>

  <div class="markdown-code-block">
    <pre lang="js" class="js"><code class="hljs javascript"><span class="hljs-comment"><span class="hljs-comment">/* webpackChunkName: vendor*/</span></span>
    </code></pre>
    <div class="markdown-code-block-copy-btn"></div>
  </div>
</body>

</html>